<template>
  <div class="viewcontainer" v-if="dataset">
    <el-row class="view-header">
      <el-col :span="22">
        <hi-lquery
          :columnsTotal="3"
          v-bind="queryPanel"
          :target="dataset"
        ></hi-lquery>
      </el-col>
    </el-row>
    <el-row class="view-main">
      <el-table
        ref="dataTable"
        :data="dataset.data"
        height="100%"
        style="width: 100%"
        v-loading="dataset.loading"
      >
        <el-table-column type="index" width="50" />
        <el-table-column prop="record_id" label="记录编号" width="160" />
        <el-table-column prop="drugstore" label="药店名称" width="160" />
        <el-table-column prop="payment_status" label="订单状态" width="120">
          <template slot-scope="scope">
            <div v-if="scope.row.payment_status == 0">未付款</div>
            <div v-else-if="scope.row.payment_status == 1">已付款</div>
            <div v-else-if="scope.row.payment_status == 2">已取消</div>
          </template>
        </el-table-column>
        <!-- <el-table-column prop="take_medicine_code" label="取药码" width="140" /> -->
        <el-table-column prop="discount_money" label="优惠费用">
          <template slot-scope="scope">
            {{ formatMoney(scope.row.discount_money) }}
          </template>
        </el-table-column>
        <el-table-column prop="medicine_money" label="药品费用">
          <template slot-scope="scope">
            {{ formatMoney(scope.row.medicine_money) }}
          </template>
        </el-table-column>
        <el-table-column prop="total_money" label="总金额" width="140">
          <template slot-scope="scope">
            {{ formatMoney(scope.row.total_money) }}
          </template>
        </el-table-column>
        <el-table-column prop="take_drug_method" label="取药方式">
          <template slot-scope="scope">
            <div v-if="scope.row.take_drug_method == 1">自取</div>
            <div v-else-if="scope.row.take_drug_method == 2">派送</div>
          </template>
        </el-table-column>
        <el-table-column prop="type" label="订单类型">
          <template slot-scope="scope">
            <div v-if="scope.row.type == 0">处方购药单</div>
            <div v-else-if="scope.row.type == 1">非处方购药单</div>
          </template>
        </el-table-column>
        <el-table-column fixed="right" label="操作" width="80">
          <template slot-scope="scope">
            <el-button type="text" size="small" @click="showDetail(scope.row)">
              详情
            </el-button>
          </template>
        </el-table-column>
      </el-table>
    </el-row>
    <el-row class="view-footer pagebar">
      <hi-pagination
        background
        :total="dataset.total"
        :target="dataset"
      ></hi-pagination>
    </el-row>
  </div>
</template>
<script>
import { HiPagination, HiLquery, utils } from "hi-ui";
import viewBase from "../../base";
import buyMedicineCfg from "./dataset/buyMedicinelist";
export default {
  name: "buyMedicinelist",
  extends: viewBase,
  components: { HiPagination, HiLquery },
  data() {
    let datasetCfg = Object.assign({}, buyMedicineCfg, {
      action: "autoAction",
    });
    return {
      //数据桥梁
      dataBridge: new Map(),
      dataset: null,
      //数据集配置
      datasetCfg: datasetCfg,

      total: 100,
      //查询面板配置
      queryPanel: {
        fields: [
          {
            element: "el-input",
            label: "记录编号",
            name: "record_id",
          },
          {
            element: "el-input",
            label: "药店名称",
            name: "drugstore",
          },
        ],
      },
    };
  },

  computed: {},
  watch: {},
  methods: {
    formatMoney(val) {
      return utils.number.format(val, "￥");
    },
    //详情
    showDetail(data) {
      this.openByPath(
        "/sales/buyMedicine/detail",
        { id: data.record_id },
        { title: "购药单详情", target: "_blank" }
      );
    },
  },
  mounted() {
    //创建数据集
    this.dataset = this.createDataSet(this.datasetCfg);
    this.dataBridge.set(this.dataset, ["dataTable"]);
  },
};
</script>
<style rel="stylesheet/scss" lang="scss" scope>
</style>